<template>
	<el-card style="height: 700px">
		<el-form class="searchForm" size="small" label-width="70px">
			<el-form-item label="数据源">
				<el-select v-model="currentDsId" placeholder="请选择数据源" @change="checkDataSource(currentDsId)">
					<el-option v-for="item in dataSources" :key="item.id" :label="item.name" :value="item.id">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="数据表">
				<el-input v-model="tableKeyWord.tableName" placeholder="请输入表名称"></el-input>
			</el-form-item>
		</el-form>
		<div class="boxFlex">
			<el-button type="primary" @click="findAllByName" size="small"><i class="el-icon-search"></i> 搜索</el-button>
			<el-button type="info" size="small" @click="codeGenByList">	<i class="el-icon-download"></i> 批量生成</el-button>
		</div>
		<div>
			<el-table :data="tableData" @selection-change="selectTableData"
					  height="800"
					  border style="width: 100%":cell-style="{'text-align' :'center'}"
					  :header-cell-style="{'text-align' :'center'}">
				<el-table-column type="selection" width="55"></el-table-column>
				<el-table-column type="index" label="序号" width="50"> </el-table-column>
				<el-table-column prop="tableName" label="表名称" width="180"> </el-table-column>
				<el-table-column prop="tableDesc" label="表注释"> </el-table-column>
				<el-table-column prop="createTime" label="创建时间"> </el-table-column>
				<el-table-column prop="storageEngine" label="存储引擎"> </el-table-column>
				<el-table-column prop="address" label="操作">
					<template slot-scope="scope">
						<el-button type="primary" size="small" @click="codeGen(scope.row)"><i class="el-icon-download"></i> 生成代码</el-button>
					</template>
				</el-table-column>
			</el-table>
			<el-dialog title="代码生成" :visible.sync="dialogVisible" width="950px" :before-close="handleClose">
				<div class="add_user_box">
					<div class="add_user_cont">
						<div class="add_card">
							<el-form :model="genDataSource" ref="addUser" label-width="100px" status-icon size="mini">
								<el-form-item label="作者" prop="renBianHao">
									<el-input v-model="genDataSource.auth" placeholder="请输入作者"></el-input>
								</el-form-item>
								<el-form-item label="模块名" prop="renBianHao">
									<el-input v-model="genDataSource.module" placeholder="请输入模块名:(例如:cn.demoxy)"></el-input>
								</el-form-item>
							</el-form>
						</div>
					</div>
				</div>
				<span slot="footer" class="dialog-footer">
					<el-link type="primary" class="btn" @click="genCode">生成</el-link>
              		<el-link type="danger" class="btn">取消</el-link>
				</span>
			</el-dialog>
		</div>
	</el-card>
</template>

<script>
import {findAllDataSource, findDataSourceById} from "../../../api/admin/gencode/dataSource";
import {codeGen, selectAllTablesByDataBase} from "../../../api/admin/gencode/codeGen";
export default {
	name: "CodeGen",
	data() {
		return {
			dialogVisible: false,
			dataSources: [],
			currentDsId: "",
			tableData: [],
			currentDataSource: "",
			tableKeyWord: {
				tableName: "",
				username: "",
				url: "",
				password: "",
			},
			genDataSource: {
				tables: "",
				auth: "",
				username: "",
				url: "",
				password: "",
				module: "",
			},
			tables:''
		}
	},
	created() {
		//初始化所有的数据源
        findAllDataSource({}).then((res) => {
			this.dataSources = res.data.data.records;
			//默认选择第一个数据源
			this.currentDsId=res.data.data.records[0].id;
			this.checkDataSource(this.currentDsId);
		})
	},
	methods: {
		/**
		 *批量生成代码
		 */
		codeGenByList(){
			this.genDataSource.url = this.currentDataSource.url
			this.genDataSource.username = this.currentDataSource.username
			this.genDataSource.password = this.currentDataSource.password
			this.genDataSource.tables = this.tables
			//显示生成代码弹框表单
			this.dialogVisible = true
		},
		/**
		 * 数据源下拉框数据切换
		 */
		async checkDataSource(dsId) {
			//通过id获取到当前选中的数据源对象
			await findDataSourceById(dsId).then((res) => {
				this.currentDataSource = res.data.data
			})
			//根据数据源查询所有表信息
			await selectAllTablesByDataBase(this.currentDataSource).then((res1) => {
				this.tableData = res1.data.data
			}).catch(active=>{
				this.$message.error('数据库连接超时')
			})
		},
		/**
		 * 代码生成
		 */
		codeGen(rows) {
			//获取数据源连接信息和当前表名称
			this.genDataSource.url = this.currentDataSource.url
			this.genDataSource.username = this.currentDataSource.username
			this.genDataSource.password = this.currentDataSource.password
			this.genDataSource.tables = rows.tableName
			//显示生成代码弹框表单
			this.dialogVisible = true
		},
		handleClose(done) {
			done()
		},
		/**
		 * 关闭代码生成弹框,清空表单输入框信息
		 */
		guanBi() {
			this.genDataSource.url = ""
			this.genDataSource.username = ""
			this.genDataSource.password = ""
			this.genDataSource.tableName = ""
			this.genDataSource.auth = ""
			this.genDataSource.module = ""
			this.dialogVisible = false
		},
		/**
		 * 生成单表代码
		 */
		genCode() {
			const settings = require("../../../config/settings")
			window.location.href =
					settings.env == "prod"
							? settings.baseUrl.production
							: settings.baseUrl.development + "/admin/demo-table/codeGenerator?url="+
							this.genDataSource.url+"&username="+this.genDataSource.username+"&password="
			+this.genDataSource.password+"&tables="+this.genDataSource.tables+"&auth="+this.genDataSource
			.auth+"&module="+this.genDataSource.module;
		},
		/**
		 * 根据数据源名称模糊查询数据源列表
		 */
		findAllByName() {
			this.tableKeyWord.username = this.currentDataSource.username
			this.tableKeyWord.url = this.currentDataSource.url
			this.tableKeyWord.password = this.currentDataSource.password
            selectAllTablesByDataBase(this.tableKeyWord).then((res1) => {
				this.tableData = res1.data.data
			})
			this.tableKeyWord.tableName = ""
		},

		/**
		 * table表格勾选数据
		 */
		selectTableData(val) {
			let tables=[];
			for (let item of val){
				tables.push(item.tableName)
			}
			var tableStr = tables.join(",");
			this.tables=tableStr;
		},
	},
}
</script>

<style lang="scss" scoped>
@import "~@/style/admin/gencode/codeGen.scss";
a.btn {
	margin: 0 5px;
}
</style>
